<template>
    <view class="context">
        <view class="tit">{{ title }}</view>
        <textarea
            class="text-area"
            :placeholder="placeholder"
            :value="value"
            @blur="onBlur"
            placeholder-style="font-size:13px;color:#aaa"
            auto-height="true"
            maxlength="3000"
        >
        </textarea>
    </view>
</template>

<script>
import lang from "../../js/conf/Lang.js";
import goodsCtrl from "../../js/gd/GoodsCtrl.js";
import projectCtrl from "../../js/project/GoodsCtrl.js";

export default {
    props: ["value", "is_good_type"],
    data() {
        return {
            title: lang.remarksTxt.title,
            placeholder: lang.remarksTxt.placeholderTxt,
            inputTxt: this.value,
            is_good: this.is_good_type ? this.is_good_type : 1,
        };
    },

    methods: {
        onBlur(e) {
            this.inputTxt = e.detail.value;
            if (this.is_good == 1) {
                goodsCtrl.sesRemarks(this.inputTxt);
            } else {
                projectCtrl.sesRemarks(this.inputTxt);
            }
        },
    },
};
</script>

<style lang="scss">
.context {
    padding: 10px 0;
    font-size: 13px;
    width: 100%;
    .tit {
        font-weight: bold;
    }
    .text-area {
        height: 150px;
        width: calc(100% - 20px);
        border: 1px solid #ececec;
        padding: 10px;
        white-space: pre-wrap;
    }
}
</style>
